import React, { useState } from "react";
import { Modal, Button, Input, Form, Radio } from "antd";

export default function Upscore() {
  const [isModalVisible, setIsModalVisible] = useState(false);

  const showModal = () => {
    setIsModalVisible(true);
  };

  const handleOk = () => {
    setIsModalVisible(false);
  };

  const handleCancel = () => {
    setIsModalVisible(false);
  };
  const [value, setValue] = React.useState(1);

  const onChange = (e) => {
    console.log("radio checked", e.target.value);
    setValue(e.target.value);
  };

  return (
    <>
      <Button onClick={showModal} block>
        上分
      </Button>
      <Modal
        title="充值"
        visible={isModalVisible}
        onOk={handleOk}
        onCancel={handleCancel}
      >
        <Form>
          <Form.Item name={["user", "states"]} label="新资金" initialValue={1}>
            <Radio.Group onChange={onChange} value={value}>
              <Radio value={1}>否</Radio>
              <Radio value={2}>是</Radio>
          
            </Radio.Group>
         <div> 新资金时，将扣除对应手续费</div>  
          </Form.Item>
          <Form.Item
            name={["user", "website"]}
            label="充值金额"
            rules={[{ required: true }]}
          >
            <Input placeholder="请输入充值金额" />
          </Form.Item>
          <Form.Item
            name={["user", "website"]}
            label="确认充值金额"
            rules={[{ required: true }]}
          >
            <Input placeholder="请输入充值金额" />
          </Form.Item>
        </Form>
      </Modal>
    </>
  );
}
